<template>
  <div class>
    <van-nav-bar title="视频专栏" left-arrow @click-left="$router.back()" left-text="返回"/>
    <van-grid :column-num="2">
      <van-grid-item v-for="value in video" :key="value.id" @click="toVideo(value.videoPath)">
        <van-image :src="value.imgPath" rel="external nofollow"/>
        <span class="movieText">{{ value.title }}</span>
      </van-grid-item>
    </van-grid>
  </div>
</template>

<script>
import { getMovie } from './movie'

export default {
  name: 'movie',
  data () {
    return {
      video: []
    }
  },
  methods: {
    toVideo (path) {
      console.log(path)
    }
  },
  mounted () {
    getMovie({ state: 1, token: '5636a44a-944b-41f5-bf57-011e81550d16' }).then(res => {
      this.video = JSON.parse(res.data.message)
      this.video.forEach(item => {
        item.imgPath = `http:${item.imgPath}`
      })
      console.log(this.video)
    })
  }
}
</script>

<style lang="less" scoped>
.movieText{
  font-size: 16px;
}
</style>
